@charset "utf-8";

.web{position: relative;
	height: 100%;
header{width: 100%;
		position: absolute;
		display: flex;
		justify-content: space-between;
		align-items: center;
	.back{
		width: vw(120);
		height: vw(50);
		text-align: center;
		// box-sizing: border-box;
		// padding: 0 vw(30);
		border: 2px solid $color;
		border-radius: 12px;
			span{vertical-align: middle;
			line-height: vw(50);
				font-size: vw(26);
				color:black;
		}
	}
	.itemize{font-size: vw(26);
	}
}

.main_list{
	width: 100%;
	padding: 0 vw(23);
    box-sizing: border-box;
	position: absolute;
	top:vw(100);
	bottom:vw(136);
	overflow: auto;
	.top_one{
		display: flex;
		justify-content: space-between;
		img{
			width: vw(150);
			height: vw(150);
		}
	p{text-align: center;
	font-size: vw(26);
	color:black;
			}
		}
	.radius_four{display: flex;
		// width: vw(100);
		justify-content:center;
		
		.radius_one{width: vw(20);
		height: vw(20);
		border: 1px solid transparent;
		background-color: #ffc9a1;
		border-radius: 50%;
		margin: 0 vw(10);
		}
		.radius_one:first-child{background-color: $color;
		}
	}
.list_three{
		
	.tittle{
			padding-top: vw(20);
			display: flex;
			align-items: center;
			position: relative;
			i{ color:$color;
				font-size: vw(56);
			}
			p{font-size: vw(30);}
			span{font-size: vw(26);}
			a{ 
			position: absolute;
			right: vw(0);
				color:black;
				font-size: vw(24);
				i{font-size: vw(28);
				}
			}
		}
			
		
	.nav_photo{
		padding: vw(35) 0;
		display: flex;
		justify-content: space-between;
		.list_photo{
			width: vw(150);
			height: vw(150);
			img{
				width: 100%;
			}
		}
		.list_photo1{
			width: vw(150);
			height: vw(150);
			background-color: black;
			img{
				width: 100%;
				
			}
		}
	}
}


	// main End
	}
// web End
}
